<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<!-- 3.1 包含用户名，密码，性别，学院，爱好，自我介绍及提交按钮
	      3.2 包含:输入框，密码框，单选框，多选框，文本域，下拉列表
	      3.3 每个需要提交的标签都要有name值
	      3.4 按照name的方式查找各个元素
	      3.5 按照标签的方式查找各个元素 -->
	<body>
		<form action="" method="post">
			用户名：<input type="text" name="names" id="" value="" /><br><br>
			
			密码：<input type="password" name="paswd" id="" value="" /><br><br>
			
			性别：<input type="radio" name="sex" id="" value="sex1" />男
			<input type="radio" name="sex" id="" value="sex2" />女
			<br>
			<br>
			
			学院：<select>
				<option name='majoy' value ="软件工程学院">软件工程学院</option>
				<option name='majoy' value ="财经商贸学院">财经商贸学院</option>
				<option name='majoy' value ="医学护理学院">医学护理学院</option>
			</select>
			<br>
			<br>
			爱好：<input type="checkbox" name="swim" id="" value="游泳" />游泳
			<input type="checkbox" name="table" id="" value="打羽毛球" />打羽毛球
			<input type="checkbox" name="sleep" id="" value="睡觉" />睡觉
			<br>
			<br>
			
			自我介绍：<textarea rows="10" cols="20" name='me'>
				
			         </textarea>
			<br>
			<br>
			
			<button type="submit" name="go" value="提交">提交</button>
			
		</form>
	</body>
	<script type="text/javascript">
		//  3.4 按照name的方式查找各个元素
		var b1=document.getElementsByName('names')
		console.log(b1);

		var b2=document.getElementsByName('paswd')
		console.log(b2);

		var b3=document.getElementsByName('sex')
		console.log(b3);

		var b4=document.getElementsByName('majoy')
		console.log(b4);
		
		var b5=document.getElementsByName('swim')
		console.log(b5);

		var b6=document.getElementsByName('table')
		console.log(b6);

		var b7=document.getElementsByName('sleep')
		console.log(b7);

		var b8=document.getElementsByName('me')
		console.log(b8);

		var b9=document.getElementsByName('go')
		console.log(b9);
	    //   3.5 按照标签的方式查找各个元素
		var a1=document.getElementsByTagName('form')
		console.log(a1);

		var a2=document.getElementsByTagName('select')
		console.log(a2);

		var a3=document.getElementsByTagName('input')
		console.log(a3);

		var a4=document.getElementsByTagName('textarea')
		console.log(a4);

		var a5=document.getElementsByTagName('button')
		console.log(a5);
	</script>
</html>
